<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      function SuperType() {
        this.name = "aaaddd";
        this.color = ["red", "green", "yellow"];
      }

      SuperType.prototype.sayHi = function () {
        console.log("hello"+this.name);
      };

      function object(o) {
        function F() {}
        F.prototype = o;
        return new F();
      }

      // 其实就是中间包了一层 F() {} 没有任何属性，所以在SubType原型上就没有多余的属性
      function inheritPrototype(subType, superType) {
        // 只拷贝构造函数原型上的函数，构造函数自身带的属性不拷贝
        let prototype = object(superType.prototype);
        prototype.constructor = subType;
        // 原型的constructor指针指向构造函数
        subType.prototype = prototype;
      }

      let obj3 = object(SuperType.prototype)
      console.log('obj3', obj3);

      function SubType(name = 'moren', age = 10) {
        // 自生自带的属性
        SuperType.call(this, name);
        this.age = age
      }

      // 开始继承
      inheritPrototype(SubType, SuperType)

      // 继承后写自身原型的方法
      SubType.prototype.walk = function () {
        console.log('走路');
      }


      let obj1 = new SubType()
      let obj2 = new SubType('bbb', 30)
      console.log(SubType.prototype);
      console.log(obj1.__proto__ === SubType.prototype);
      console.log('obj1', obj1);
      obj1.sayHi()
      obj1.color.push('blue')
      console.log(obj1.color);
      console.log(obj2.color);
      obj1.walk()
      obj2.sayHi()

    </script>
  </body>
</html>
